<template>
    <div id="TodoMain">
        <Article @searchNumber="getSearch" :plans="props.plans"/>
        <Item @someEvent="getHandle" :plans="props.plans" :j="j" :k="k" @getData="setData" />
    </div>
</template>

<script setup >
    import Article from './TodoArticle.vue'
    import Item from './TodoItem.vue'
    import { ref,onMounted,defineEmits,defineProps } from 'vue'
    const j = ref(-1)
    const k = ref(-1)
    
    const props = defineProps({
		plans: Array,
	})

    function getSearch(j1,k1){
        j.value = j1
        k.value = k1
    }

    function getHandle(e){
        var second = new Date().getTime() + 8 * 60 * 60 * 1000
        var beijingTime = new Date(second).toISOString().replace(/T/, ' ').replace(/\..+/, '').substring(0, 19);
        if(e){
            props.plans.push({
                content: e,
                state: false,
                important: false,
                time: beijingTime
            })
        }
        save()
    }
    function save(){
        localStorage.setItem("plans", JSON.stringify(props.plans));
        location.reload()
    }
</script>

<style scoped>
    #TodoMain{
        float: right;
        width: 100%;
        height: 79vh;
    }
</style>